<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      name="viewport"
      content="initial-scale=1.0, user-scalable=no, width=device-width"
    />
    <title>地点关键字 + 驾车路线规划</title>
    <style type="text/css">
      html,
      body,
      #container {
        width: 100%;
        height: 100%;
      }
    </style>
    <link
      rel="stylesheet"
      href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css"
    />
    <script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
    <script
      type="text/javascript"
      src="https://cache.amap.com/lbs/static/addToolbar.js"
    ></script>
  </head>
  <body>
    <div id="container"></div>
    <script type="text/javascript">
      window._AMapSecurityConfig = {
        securityJsCode: '56d60b1693f885f4d649d95e61287c85',
      }
    </script>
    <script
      type="text/javascript"
      src="https://webapi.amap.com/maps?v=2.0&key=2049e83083aa01c9148d1b2c89025933&plugin=AMap.Driving"
    ></script>
    <script type="text/javascript">
      //基本地图加载
      var map = new AMap.Map('container', {
        resizeEnable: true,
        center: [116.397428, 39.90923], //地图中心点
        zoom: 13, //地图显示的缩放级别
      })
      function drawRouter(startAddress,endAddress) {
        var driving = new AMap.Driving({
          map: map,
        })
        // 根据起终点名称规划驾车导航路线
        driving.search(
          [
            { keyword: startAddress },
            { keyword: endAddress },
          ],
          function (status, result) {
            // result 即是对应的驾车导航信息，相关数据结构文档请参考  https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
            if (status === 'complete') {
              log.success('绘制驾车路线完成')
            } else {
              log.error('获取驾车数据失败：' + result)
            }
          }
        )
      }
    </script>
  </body>
</html>
